<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>骰子</title>
		<style type="text/css">
			table{
				margin: 0 auto;
				text-align: center;
			}
		</style>
	</head>
	<body>
		<table  border="0" cellspacing="" cellpadding="">
					<tr>
						<td>
							<select id="sel" name="">
								<option value="none">选择大小</option>
								<option value ="big">大</option>
								<option value ="small">小</option>
							</select>
						</td>
					</tr>
					<tr>
						<td width="120" height="120" ><img id="img" src="./img/摇色子/1.jpg" ></td>
						
					</tr>
					<tr>
						<td><button type="button" id="btn" onclick="DoONclick(event);">开始</button></td>
					</tr>
				</table>
	</body>
	<script type="text/javascript">
		function DoONclick(event){
			var sel = document.getElementById('sel');
			if(sel.value=='none'){
				alert('请选择大小');
				return;
			}
			event.target.innerText = '买定离手...';
			var setime = 0;
			var imgall = document.getElementById('img');
			
			var text = setInterval(function(){
				setime++;
				var radNum = getRandom();
				console.log(radNum);
				imgall.src = './img/摇色子/'+radNum+'.jpg'
				if(setime>40){
					clearInterval(text);
					event.target.innerText = '客官再来一次？';
				document.getElementById('btn').disabled=false
						switch (sel.value){
							case 'big':
								if (radNum>=4) {
									alert('猜对了')
								}else{
									alert('猜错了')
								}
								break;
							case 'small':
								if (radNum<=3) {
									alert('猜对了')
								}else{
									alert('猜错了')
								}
								break;
							default:
								break;
						}
				}
			},200)
			}		
			function getRandom(){
						while(true){
							var num =  Math.floor(Math.random()*10);
							if(num != 0 && num!=7 && num!=8 && num!=9){
								return num;
							}
						}
					}	
	</script>
</html>
